import { createRouter, createWebHistory } from 'vue-router'
//  createMemoryHistory,createWebHashHistory,
// import Layout from '../components/Layout/layout.vue'
import fuPina from '../views/demPina/fu.vue'
import Layout from '../layout/AppLayout.vue'
import productRoutes from './modules/produce'
import nprogress from 'nprogress'
import { useStoreLogin } from '@/store/userLogin.js'
import 'nprogress/nprogress.css'

const routes = [
  {
    // 配置的根页面的布局容器
    path: '/',
    name: 'layout',
    component: Layout, // ()=>import ('./')  路由懒加载
    meta: {
      requiresAuth: true
    },
    children: [
      {
        path: '/',
        name: 'home',
        component: () => import('../views/demPina/zi.vue'),
        meta: {
          title: '首页'
        }
      },
      productRoutes
    ]
  },
  {
    path: '/fuPina',
    name: 'ces',
    component: fuPina // () => import('../views/demPina/fu.vue')
  },
  {
    path: '/login',
    name: 'login',
    component: () => import('@/views/login/index.vue')
  }
]

const router = createRouter({
  /*  
    上面两种是通过 window.history.state 来管理历史记录
    这是哈希值 路径中带＃号 createWebHashHistory
    这是不带#号的 createWebHistory

     这个是通过维护一个队列和一个位置来实现路由记录的管理
    这是基于内存的历史纪录 主要目的是处理ssr createMemoryHistory
  */
  history: createWebHistory(),

  routes
})

router.beforeEach((to) => {
  const store = useStoreLogin()

  if (to.meta.requiresAuth && !store.token) {
    return {
      name: 'login',
      query: { redirect: to.fullPath }
    }
  }

  // 开始加载进度条
  nprogress.start()
})

router.afterEach(() => {
  // 结束加载进度条
  nprogress.done()
})

// 默认导出
export default router
